<template>
	<div class="main_spac1 maincl">
		<div class="main_white padding10">
			<div class="mainor_form">
				<div class="mainor_te">
					<router-link to="/user/list/add" class="mainor_tea"
						>创建用户</router-link
					>
					<!-- <el-button>导入</el-button> -->
					<el-button @click="exportb"
						>导出<el-tooltip class="item" effect="dark" placement="bottom">
							<div slot="content">
								注释：默认导出全部，也可勾选导出你想要的数据
							</div>
							<svg
								aria-hidden="true"
								class="navbar_svg new_navbar_svg"
								width="14"
								height="14"
							>
								<use xlink:href="#icon-summary_question" />
							</svg> </el-tooltip
					></el-button>
					<el-button @click="importDialog">导入</el-button>
				</div>
				<el-form
					:inline="true"
					:model="form"
					class="demo-form-inline"
					ref="userListFrom"
					label-width="70px"
				>
					<el-form-item label="用户" prop="nickname">
						<el-input
							v-model.trim="form.nickname"
							placeholder="名称/编码/手机/联系人"
							clearable
							class="wid220"
						></el-input>
					</el-form-item>
					<el-form-item label="分组" prop="group_id">
						<el-select
							v-model.trim="form.group_id"
							placeholder="分组"
							class="wid220"
						>
							<el-option label="所有" value=""></el-option>
							<el-option
								v-for="(group, index) in list.group"
								:key="index"
								:label="group"
								:value="index"
							></el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="状态" prop="status">
						<el-select
							v-model.trim="form.status"
							placeholder="状态"
							class="wid220"
						>
							<el-option label="所有" value=""></el-option>
							<el-option label="禁用" :value="1"></el-option>
							<el-option label="正常" :value="2"></el-option>
							<el-option label="审核" :value="3"></el-option>
						</el-select>
					</el-form-item>
					<div class="more el-form-item" @click="more">
						<span>更多</span>
						<i :class="[{ on: moredata }, ' el-icon-arrow-down']"></i>
					</div>
					<div class="clearfix"></div>
					<el-collapse-transition>
						<div v-if="moredata">
							<el-form-item label="业务员" prop="salesman_id">
								<el-select
									v-model.trim="form.salesman_id"
									placeholder="业务员"
									class="wid220"
								>
									<el-option label="所有" value=""></el-option>
									<el-option
										v-for="(salesman, index) in list.salesman"
										:key="index"
										:label="salesman"
										:value="index"
									></el-option>
								</el-select>
							</el-form-item>
							<el-form-item label="区域" prop="region_id">
								<el-select
									v-model.trim="form.region_id"
									placeholder="区域"
									class="wid220"
								>
									<el-option label="所有" value=""></el-option>
									<el-option
										v-for="(region, index) in list.region"
										:key="index"
										:label="region"
										:value="index"
									></el-option>
								</el-select>
							</el-form-item>
							<el-form-item label="注册时间" prop="createTime">
								<el-date-picker
									v-model="createTime"
									type="daterange"
									class="time220"
									:editable="false"
									unlink-panels
									range-separator="至"
									start-placeholder="开始日期"
									end-placeholder="结束日期"
									value-format="yyyy-MM-dd"
									:clearable="false"
									:picker-options="pickerOptions"
								/>
							</el-form-item>
							<el-form-item label="支付方式" prop="pay_type">
								<el-select
									v-model.trim="form.pay_type"
									placeholder="支付方式"
									class="wid220"
								>
									<el-option label="所有" value=""></el-option>

									<el-option label="货到付款" :value="1"></el-option>
									<el-option label="在线支付" :value="2"></el-option
									><el-option label="全部" :value="3"></el-option>
								</el-select>
							</el-form-item>
							<el-form-item label="时间账期" prop="overdue_status">
								<el-select
									v-model.trim="form.overdue_status"
									placeholder="时间账期"
									class="wid220"
								>
									<el-option label="所有" value=""></el-option>
									<el-option label="正常" :value="1"></el-option>
									<el-option label="提醒" :value="2"></el-option>
									<el-option label="逾期" :value="3"></el-option>
								</el-select>
							</el-form-item>
							<el-form-item label="信用金" prop="credit_status">
								<el-select
									v-model.trim="form.credit_status"
									placeholder="信用金"
									class="wid220"
								>
									<el-option label="所有" value=""></el-option>
									<el-option label="正常" :value="1"></el-option>
									<el-option label="提醒" :value="2"></el-option>
									<el-option label="超额" :value="3"></el-option>
								</el-select>
							</el-form-item>
							<el-form-item label="子账号" prop="child_name">
								<el-input
									v-model.trim="form.child_name"
									placeholder="手机/名称"
									clearable
									class="wid220"
								></el-input>
							</el-form-item>
						</div>
					</el-collapse-transition>
					<div class="clearfix"></div>
					<el-form-item class="marginTop10">
						<el-button
							class="reset marginLeft10"
							type="primary"
							@click="$refs['userListFrom'].resetFields(), (createTime = [])"
							>重置</el-button
						>
						<el-button
							type="primary"
							@click="getArticleList"
							:loading="listLoading"
							>搜索</el-button
						>
					</el-form-item>
				</el-form>
			</div>
			<div class="main_num boxdq">
				<div class="main_num_l box">
					<p>
						正常：
						<em>{{ list.normal }}</em>
					</p>
					<p>
						审核中：
						<em>{{ list.verify }}</em>
					</p>
					<p>
						禁用：
						<em>{{ list.forbidden }}</em>
					</p>
					<p>
						小计：
						<em>{{ list.subtotal }}</em>
					</p>
					<p>
						回收站：
						<em>{{ list.recycle }}</em>
					</p>
					<p>
						用户总量：
						<em>{{ list.all }}</em>
					</p>
				</div>
			</div>
			<div class="main_table" style="min-height: 590px">
				<el-table
					ref="multipleTable"
					v-loading="listLoading"
					:data="list.list.data"
					element-loading-text="加载中"
					fit
					border
					highlight-current-row
					:row-class-name="getRowClass"
					@selection-change="handleSelectionChange"
				>
					<!-- <el-table-column type="expand" class-name="main_hei">
            <template slot-scope="props">
              <el-table
                :data="props.row.sub_account"
                class="mainex_ta"
                fit
                :highlight-current-row="false"
              >
                <el-table-column label width="40" align="right" />
                <el-table-column label="名称" prop="nickname" width="300" />
                <el-table-column label="手机" prop="mobile" width="300" />
                <el-table-column
                  label="联系人"
                  prop="address.name"
                  width="300"
                />
                <el-table-column label="收货地址" width="300">
                  <template slot-scope="scope">{{
                    scope.row.address ? scope.row.address.address : ""
                  }}</template>
                </el-table-column>
                <el-table-column
                  label="状态"
                  prop="status"
                  width="300"
                  class-name="main_hei"
                >
                  <template slot-scope="scope">{{
                    scope.row.status == 1 ? "正常" : "禁用"
                  }}</template>
                </el-table-column>
                <el-table-column label prop width="100" />
              </el-table>
            </template>
          </el-table-column> -->

					<el-table-column type="selection" />
					<div v-for="(field, index) in list.field" :key="index">
						<el-table-column
							label="用户名称"
							prop="nickname"
							:show-overflow-tooltip="true"
							v-if="field == 1"
						>
							<template slot-scope="scope">
								<div>
									<div class="user_cell_cox">
										<div>
											<el-popover
												v-show="scope.row.labels.length > 0"
												placement="bottom-start"
												width="200"
												trigger="hover"
											>
												<div class="item-label">
													<span v-for="item in scope.row.labels" :key="item">
														{{ labels[item] }}
													</span>
												</div>

												<img
													slot="reference"
													class="label-pic"
													src="../../assets/images/10.png"
												/>
											</el-popover>
										</div>
										<span>{{ scope.row.nickname }}</span>
									</div>
									<span>{{ scope.row.nickname }}</span>
								</div>
							</template>
						</el-table-column>
						<el-table-column
							label="手机"
							prop="mobile"
							:show-overflow-tooltip="true"
							v-if="field == 2"
						/>
						<el-table-column
							label="编码"
							prop="info.code"
							:show-overflow-tooltip="true"
							v-if="field == 3"
						/>
						<el-table-column
							label="联系人"
							prop="address.name"
							:show-overflow-tooltip="true"
							v-if="field == 4"
						/>
						<el-table-column
							label="收货手机"
							prop="address.mobile"
							:show-overflow-tooltip="true"
							v-if="field == 5"
						/>
						<el-table-column
							label="收货地址"
							prop="address.address_name"
							:show-overflow-tooltip="true"
							v-if="field == 6"
							min-width="140"
						>
							<template slot-scope="scope">{{
								scope.row.address ? scope.row.address.address_name : ""
							}}</template>
						</el-table-column>
						<el-table-column
							label="业务员"
							:show-overflow-tooltip="true"
							v-if="field == 7"
						>
							<template slot-scope="scope">
								{{
									scope.row.info
										? scope.row.info.salesman
											? scope.row.info.salesman.name
											: ""
										: ""
								}}
							</template>
						</el-table-column>
						<el-table-column
							label="用户分组"
							prop="info.group.title"
							:show-overflow-tooltip="true"
							v-if="field == 8"
						/>
						<el-table-column
							label="区域"
							prop="info.region.title"
							:show-overflow-tooltip="true"
							v-if="field == 9"
						/>
						<el-table-column
							label="支付方式"
							prop="pay_type"
							:show-overflow-tooltip="true"
							v-if="field == 10"
						>
							<template slot-scope="scope">{{
								scope.row.pay_type_document
							}}</template>
						</el-table-column>
						<el-table-column
							label="时间账期"
							prop="overdue_status"
							:show-overflow-tooltip="true"
							v-if="field == 11"
						>
							<template slot-scope="scope">{{
								scope.row.info
									? scope.row.info.overdue_status + 1 == 1
										? "正常"
										: scope.row.info.overdue_status + 1 == 2
										? "提醒"
										: "逾期"
									: ""
							}}</template>
						</el-table-column>
						<el-table-column
							label="信用金"
							prop="credit_status"
							:show-overflow-tooltip="true"
							v-if="field == 12"
						>
							<template slot-scope="scope">{{
								scope.row.info
									? scope.row.info.credit_status + 1 == 1
										? "正常"
										: scope.row.info.credit_status + 1 == 2
										? "提醒"
										: "超额"
									: ""
							}}</template>
						</el-table-column>

						<el-table-column
							label="状态"
							prop="userNickname"
							:show-overflow-tooltip="true"
							:render-header="renderHeader2"
							v-if="field == 13"
						>
							<template slot-scope="scope">
								<div class="main_link">
									<el-link type="info" v-if="scope.row.status == 0"
										>禁用</el-link
									>
									<el-link type="success" v-else-if="scope.row.status == 1"
										>正常</el-link
									>
									<el-link type="danger" v-else>审核</el-link>
								</div>
							</template>
						</el-table-column>
						<el-table-column
							label="注册日期"
							prop="userNickname"
							:show-overflow-tooltip="true"
							v-if="field == 14"
						>
							<template slot-scope="scope">{{
								parseTime(scope.row.created_at, "{y}-{m}-{d}")
							}}</template>
						</el-table-column>
						<el-table-column
							label="积分"
							prop="credit_status"
							:show-overflow-tooltip="true"
							v-if="field == 15"
							width="100"
						>
							<template slot-scope="scope">{{
								scope.row.info ? scope.row.info.points : ""
							}}</template>
						</el-table-column>
					</div>
					<el-table-column
						label="管理操作"
						align="center"
						fixed="right"
						width="180"
						class-name="main_hei"
					>
						<template slot="header">
							<table-header-setting
								@openHeader="dialogFormVisible = true"
							></table-header-setting>
						</template>
						<template slot-scope="scope">
							<router-link :to="'/user/list/edit/' + scope.row.id">
								<el-link type="primary">编辑</el-link>
							</router-link>
							<el-link type="danger" @click="delet(scope.$index, scope.row.id)"
								>删除</el-link
							>
						</template>
					</el-table-column>
				</el-table>
			</div>
			<div class="main_page boxdq">
				<div></div>
				<!-- 分页 -->
				<div class="main_page_r">
					<el-pagination
						:current-page="current.page"
						:page-sizes="[20, 30, 50, 100]"
						:page-size="limit"
						layout="total, sizes, prev, pager, next, jumper"
						:total="totalCount"
						background
						@size-change="changeLimit"
						@current-change="changePage"
					/>
				</div>
			</div>
		</div>
		<el-dialog
			title="表头设置"
			:visible.sync="dialogFormVisible"
			class="main_dialog dialog500"
			@close="type = list.field"
		>
			<el-checkbox-group v-model="type">
				<el-checkbox
					v-for="(Header, index) in Header"
					:key="index"
					:label="Header.id"
					:disabled="Header.disabled"
					>{{ Header.name }}</el-checkbox
				>
			</el-checkbox-group>
			<div slot="footer" class="dialog-footer">
				<el-button @click="dialogFormVisible = false">取 消</el-button>
				<el-button type="primary" @click="setupmine" v-repeatClick
					>确 定</el-button
				>
			</div>
		</el-dialog>
		<!-- 订单导入 -->
		<el-dialog
			title="用户导入"
			:visible.sync="importbuVisible"
			class="main_dialog dialog700 importbu"
		>
			<div class="importbu_p">
				<h3>导入说明：</h3>
				<p>1.注意使用红色字体标注的必填字段,不填或错填将导致导入失败。</p>
				<p>2.导入文件仅支持xlsx格式,大小不超过2M ,数据不超过2000行。</p>
				<p>3.导入文件不能包含“合并单元格”，否则无法导入。</p>
				<p>
					4.导入时碰到数据不正确的行，系统会跳过错误的行继续执行未完成的行。
				</p>
			</div>
			<div class="importbu_in">
				<h3>数据行区间设置</h3>
				<div class="box">
					<p>
						<span>第一个数据行号：</span
						><el-input-number
							v-model="import_form.start_line_num"
							controls-position="right"
							:min="2"
						></el-input-number>
					</p>
					<p>
						<span>最后一行数据行数：</span
						><el-input
							v-model="import_form.end_line_num"
							placeholder="默认为全部"
							type="number"
						></el-input>
					</p>
				</div>
			</div>
			<div class="importbu_an box">
				<el-button class="marginRight10" @click="downTemplate"
					>下载模板</el-button
				>
				<el-upload
					class="upload-demo"
					:action="user_import"
					:on-success="importSuccess"
					:on-error="importerr"
					:show-file-list="false"
					:data="import_params"
				>
					<el-button size="small" type="primary" @click="handleUpload"
						>点击上传</el-button
					>
				</el-upload>

				<p v-if="import_file_name ? true : false">
					上传文件名：{{ import_file_name }}
				</p>
			</div>
			<div class="import_process" v-if="percentShow">
				<div class="progress">
					<el-progress
						:text-inside="true"
						:stroke-width="20"
						:percentage="percent"
						color="#19B098"
					></el-progress>
				</div>
				<div class="notice" v-if="percentShow">
					<div class="importtips">
						<p class="success" v-if="percent == 100">用户导入结束</p>
						<div v-for="(item, index) in reverseSum" :key="index">
							<p v-if="item.type == 2" :key="index" class="fail">
								{{ item.name }}，导入失败
							</p>
						</div>
					</div>
				</div>
			</div>
			<div slot="footer" class="dialog-footer">
				<el-button :disabled="cancelDisabled" @click="importbuVisible = false"
					>取 消</el-button
				>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import {
		member_index,
		member_delete,
		user_export,
		user_import_model,
	} from "@/api/user/user";
	import { field_save, user_import } from "@/api/currency";
	import { apiUrl, objKeySort, Md5 } from "@/utils/public";
	import dateOption from "@/options/dateOption";
	import { parseTime, exportMethod } from "@/utils/index";
	import { userListHeader } from "@/options/headerSet.js";
	import { mapGetters } from "vuex";

	export default {
		directives: {
			// 聚焦元素
			focus: {
				inserted(el) {
					el.querySelector("input").focus();
				},
			},
		},
		data() {
			return {
				user_import: user_import,
				// 时间
				parseTime,
				exportMethod,
				// 分页
				current: {
					page: 1,
					per_page: 20,
				},
				limit: 20,
				totalCount: 1,
				// 搜索
				form: {
					nickname: "",
					group_id: null,
					status: null,
					salesman_id: null,
					region_id: null,
					pay_type: null,
					start_time: "",
					end_time: "",
					credit_status: null,
					overdue_status: null,
					child_name: "",
				},
				createTime: [],
				pickerOptions: dateOption,
				// 更多
				moredata: false,
				// 列表数据
				list: {
					list: {
						data: [],
					},
				},
				labels: {},
				listLoading: false,
				// 全选
				selectArr: [],
				// 表头设置
				dialogFormVisible: false,
				type: [],
				Header: userListHeader,
				// 焦点
				offsetParent: true,
				// 订单导入
				importbuVisible: false,
				import_form: {
					user_type: 1,
					goods_type: 1,
					start_line_num: 2,
					end_line_num: "",
				},
				import_file_name: "",
				import_params: {
					string: "",
				},
				percent_gs: 0,
				percent: 0,
				percentShow: false,
				percent_list: [],
				importArrLength: 1,
				cancelDisabled: false,
			};
		},
		computed: {
			...mapGetters(["avatar"]),
			reverseSum() {
				return this.percent_list;
			},
		},
		// 刷新
		inject: ["reload"],
		mounted() {
			window.Echo.channel("batchImportUser." + this.avatar.company_id).listen(
				"BathImportUserEvent",
				(e) => {
					this.cancelDisabled = true;
					this.importArrLength = e.notice.count;
					this.percentShow = true;
					if (e.notice.errcode == 0) {
						this.percent_list.push({
							num: this.percent,
							type: 1,
							name: e.notice.msg,
						});
					} else if (e.notice.errcode == 100) {
						this.percent_list.push({
							num: this.percent,
							type: 2,
							name: e.notice.msg,
						});
					}
					this.percent_gs = parseInt(this.percent_gs) + 1;
					if ((this.percent_gs / this.importArrLength) * 100 >= 100) {
						this.percent = 100;
						this.cancelDisabled = false;
						return;
					}
					this.percent =
						this.percent_gs / this.importArrLength
							? parseInt((this.percent_gs / this.importArrLength) * 100)
							: 0;
				}
			);
		},
		methods: {
			// 判断表格是否有子项，无子项不显示展开按钮
			getRowClass(row) {
				if (row.row.sub_account) {
					if (row.row.sub_account.length === 0) {
						return "row-expand-cover";
					}
				}
			},
			// 下载模板
			downTemplate() {
				let data = Object.assign(
					{
						sign: Md5(
							objKeySort(Object.assign(apiUrl().name)) + apiUrl().appsecret
						),
					},
					apiUrl().name
				);
				user_import_model(data).then((res) => {
					this.exportMethod(res, "用户导入模板");
				});
			},
			// 导入订单
			importDialog() {
				this.import_file_name = "";
				this.percent_gs = 0;
				this.percent = 0;
				this.percentShow = false;
				this.percent_list = [];
				this.importArrLength = 1;
				this.cancelDisabled = false;
				this.importbuVisible = true;
			},

			importerr(err, file, fileList) {
				this.$message.error("上传失败");
			},
			importSuccess(response, file, fileList) {
				if (response.code == 100) {
					this.$message.warning(response.msg);
					return;
				}
				this.import_file_name = file.name;
			},
			handleUpload() {
				this.import_params.string =
					this.import_form.start_line_num + "," + this.import_form.end_line_num;
			},
			// 导出
			exportb() {
				let form = {};
				if (this.selectArr.length > 0) {
					form.ids = this.selectArr.join(",");
				} else {
					// let idarr = [];
					// this.list.list.data.forEach((item) => {
					//   idarr.push(item.id);
					// });
					form.ids = "";
				}
				let data = Object.assign(
					{
						sign: Md5(
							objKeySort(Object.assign(apiUrl().name)) + apiUrl().appsecret
						),
					},
					apiUrl().name,
					form
				);
				user_export(data)
					.then((res) => {
						this.exportMethod(res, "用户列表");
					})
					.catch((err) => {
						this.$message.error("导出失败");
					});
			},
			// 监听全选
			handleSelectionChange(val) {
				this.selectArr = [];
				val.map((item) => {
					this.selectArr.push(item.id);
				});
			},
			// 状态？注释
			renderHeader2(h, { column, $index }) {
				// 这里在最外层插入一个div标签
				return h("div", [
					// h即为cerateElement的简写
					// 在div里面插入span
					h("span", {
						// 表示内容
						domProps: {
							innerHTML: column.label,
						},
						on: {
							click: () => {
								console.log(`${column.label}   ${$index}`);
							},
						},
					}),
					h(
						"el-tooltip",
						{
							// 表示属性
							attrs: {
								effect: "dark",
								content: "未审核的用户，不能登录！",
								placement: "top",
							},
						},
						[
							h("i", {
								style: "margin-left: 5px;margin-top:-1px;",
								class: "el-icon-question table-msg",
							}),
						]
					),
				]);
			},
			// 搜索
			getArticleList() {
				this.current.page = 1;
				this.member_index();
			},
			// 更多
			more() {
				this.moredata = !this.moredata;
			},
			// 分页
			changeLimit(pageSize) {
				this.current.per_page = pageSize;
				this.member_index();
			},
			changePage(page) {
				this.current.page = page;
				this.member_index();
			},
			// 设置确认
			setupmine(val) {
				let arry = [];
				this.Header.map((e) => {
					this.type.map((p) => {
						if (e.id == p) {
							arry.push(e.id);
							return;
						}
					});
				});
				let data = Object.assign(
					{
						sign: Md5(
							objKeySort(Object.assign(apiUrl().name, { type: 3 })) +
								apiUrl().appsecret
						),
					},
					apiUrl().name,
					{ type: 3, fields: JSON.stringify(arry) }
					// [1,2,3,4,5,6,7,8,9,10]
				);
				field_save(data).then((res) => {
					if (res.errcode == 0) {
						this.$message({
							message: "设置成功",
							type: "success",
						});
						this.reload();
					} else {
						this.$message.error(res.errmsg);
					}
				});
			},
			// 删除
			delet(index, id) {
				let data = Object.assign(
					{
						sign: Md5(
							objKeySort(Object.assign(apiUrl().name, { id: id, type: 1 })) +
								apiUrl().appsecret
						),
					},
					apiUrl().name,
					{ id: id, type: 1 }
				);
				this.$confirm("是否删除用户?", "提示", {
					confirmButtonText: "确定",
					cancelButtonText: "取消",
					type: "warning",
				})
					.then(() => {
						member_delete(data).then((res) => {
							if (res.errcode == 0) {
								this.$message({
									message: "删除成功",
									type: "success",
								});
								this.list.list.data.splice(index, 1);
							} else {
								this.$message.error(res.errmsg);
							}
						});
					})
					.catch(() => {});
			},
			// 列表
			member_index() {
				this.listLoading = true;
				let data = Object.assign(
					{
						sign: Md5(
							objKeySort(
								Object.assign(apiUrl().name, this.list_form(), this.current)
							) + apiUrl().appsecret
						),
					},
					apiUrl().name,
					this.list_form(),
					this.current
				);
				member_index(data).then((res) => {
					this.listLoading = false;
					if (res.errcode == 0) {
						res.data.list.data.map((e) => {
							e.is_look = e.is_look == 0 ? false : true;
							e.freight_yf = false;
							// if (!e.address.address_name) {
							// 	e.address.address_name = "";
							// }
						});

						this.type = res.data.field;
						this.labels = res.data.labels;
						res.data.list.data.map((e) => {
							e.pay_type_document = "";
							e.labels = [];
							if (e.info && e.info.labels) {
								e.labels = e.info.labels.split(",");
							}
							// 筛选--开始
							let arr2 = [];
							let labels_ids = [];
							if (this.labels) {
								labels_ids = Object.keys(this.labels);
							}
							labels_ids.filter((item) => {
								e.labels.includes(item) && arr2.push(item);
							});
							e.labels = arr2;
							// 结束

							if (e.info) {
								switch (e.info.pay_type) {
									case 0:
										e.pay_type_document = "货到付款";
										break;
									case 1:
										e.pay_type_document = "在线支付";
										break;
									case 2:
										e.pay_type_document = "全部";
										break;
								}
							}
						});
						this.list = res.data;
						this.totalCount = res.data.list.total;
					} else {
						this.$message.error(res.errmsg);
					}
				});
			},
			list_form() {
				let form = JSON.parse(JSON.stringify(this.form));
				form.start_time = this.createTime[0] ? this.createTime[0] : "";
				form.end_time = this.createTime[1] ? this.createTime[1] : "";
				return form;
			},
		},
		activated() {
			if (this.$route.params.status) {
				let status = this.$route.params.status;
				this.form.status = status;
			}
			// 列表
			this.member_index();
		},
	};
</script>
<style lang="scss" scoped>
@import "@/styles/variables.scss";
.maincl {
	.main_table /deep/.el-table--small td {
		padding: 10px 0;
	}
	.main_table /deep/.el-table--small th {
		padding: 10px 0;
	}

	/deep/.el-table {
		tr {
			&:hover {
				background: none !important;
			}
			&.hover-row > td {
				background: none !important;
			}
			.current-row > td {
				background: none !important;
			}
		}
	}
	/deep/.el-table .el-table__body tr:hover {
		background: #fff !important;
	}
	/deep/.el-table .el-table__body tr:hover > td {
		background: #fff !important;
	}
	/deep/.el-table tr.expanded + tr {
		background: #fafafa !important;
	}
	/deep/.el-table tr.expanded + tr > td {
		background: #fafafa !important;
	}
	/deep/.el-table tr.expanded + tr .mainex_ta {
		background: #fafafa !important;
	}
	/deep/.el-table tr.expanded + tr .mainex_ta th,
	/deep/.el-table tr.expanded + tr .mainex_ta tr {
		background: #fafafa !important;
	}
	/deep/.el-table tr.expanded + tr:hover {
		background: #fafafa !important;
	}
	/deep/.el-table tr.expanded + tr:hover > td {
		background: #fafafa !important;
	}
	/deep/.el-table tr.expanded + tr .el-table tr:hover {
		background: #fafafa !important;
	}
	/deep/.el-table tr.expanded + tr .el-table tr:hover > td {
		background: #fafafa !important;
	}
}
.new_navbar_svg {
	vertical-align: top;
	margin-left: 5px;
	use {
		fill: #606266;
	}
}

// 导入进度条
.import_process {
	width: 100%;
}

.progress {
	padding: 15px 40px 15px 0;
}
.notice {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding-right: 40px;
	.importtips {
		overflow-y: auto;
		width: 100%;
		height: 84px;
		height: 84px;
		background: #ffffff;
		border: 1px solid #d8d8d8;
		padding: 10px 15px;
		.fail {
			color: #ff5a5a;
			line-height: 1.2;
			font-size: 12px;
		}
		.success {
			color: #19b098;
			line-height: 1.2;
			font-size: 12px;
		}
	}
}
.importbu_in {
	/deep/ .el-input__inner {
		padding-right: 0;
	}
}
.user_cell_cox {
	display: flex;
	align-items: center;
}
.label-pic {
	width: 16px;
	height: 20px;
	margin-right: 6px;
	margin-top: 2px;
}
.item-label {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.item-label span {
	height: auto;
	padding: 4px 10px;
	border: 1px solid #e6a23c;
	color: #e6a23c;
	margin-bottom: 5px;
	border-radius: 3px;
	margin-right: 10px;
}
</style>
